import React from 'react';
import {connect} from 'dva/index';
import {Button, Col, Form, Input, Popconfirm, Radio, Row, Select, Table} from 'antd';
import CompanyDetail from '../../components/company/companyDetail';
import Constants from '../../utils/Constants';
import RightBox from '../../components/common/rightBox';
import RightConstants from '../../utils/RightConstants';

const R = require('ramda');

const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;
const intendedCompany = Form.create()(class IntendedCompany extends React.Component {

    constructor(props) {
        super(props);
    }

    componentDidMount() {
        //多个页面共用一个state的page跟list，这里面的首次查询必须带默认的page信息
        this.props.dispatch({ type: 'company/queryCompanys', payload: { dealt: '0', claimStatus: '1', page: Constants.DEFAULT_PAGE } });//查询公司列表
    }

    handleSearch = (flag) => {
        let values = this.props.form.getFieldsValue();
        let newPage = this.props.company.page;
        if (!flag) newPage.page = 1;
        this.props.dispatch({
            type: 'company/queryCompanys',
            payload: {
                company: values.company,
                dealt: '0',
                claimStatus: '1',
                page: newPage
            }
        });
    };

    handleOpen = (disabled, record, marketDisabled, isAllocation) => {
        let id = record ? record.id : null;
        this.props.dispatch({
            type: 'company/getCompanyById',
            payload: {
                id
            }
        });//查询详情
        this.companyDetail.handleOpen({ disabled, id, marketDisabled, isAllocation })
    }

    handleDelete = (record) => {
        this.props.dispatch({
            type: 'company/deleteCompanyById',
            payload: {
                id: record.id, 
                onSuccess: () => { this.handleSearch(true) }
            }
        });
    }

    returnBool = (record) => {
        this.props.dispatch({
            type: 'company/updateClaimStatus',
            payload: {
                id: record.id, 
                claimStatus: "0",
                onSuccess: () => { this.handleSearch(true) }
            }
        });
    }

    columns = [
        { title: '客户号', dataIndex: 'customerno', key: 'customerno' },
        { title: '客户名称', dataIndex: 'companyName', key: 'companyName' },
        { title: '操作员', dataIndex: 'gd_user_name', key: 'gd_user_name' },
        { title: '业务员', dataIndex: 'yw_user_name', key: 'yw_user_name'},
        { title: '创建人', dataIndex: 'creator_name', key: 'creator_name' },
        { title: '创建时间', dataIndex: 'createtime', key: 'createtime' },
        {
            title: '操作', key: 'key_oprator',
            render: (text, record, index) => {
                return (
                    <span>
                        <RightBox resource={RightConstants.COMPANY.COMPANY_INTENDEDCOMPANY_EDIT} split={true}><a href="#" onClick={this.handleOpen.bind(this, false, record, null, false)}>编辑</a></RightBox>
                        <RightBox resource={RightConstants.COMPANY.COMPANY_INTENDEDCOMPANY_DELETE} split={true}>
                            <Popconfirm placement="leftTop" title={'数据删除后将不可以恢复，是否继续删除？'} onConfirm={this.handleDelete.bind(this, record)} okText="是" cancelText="否">
                                <a href="#">删除</a>
                            </Popconfirm>
                        </RightBox>
                        <RightBox resource={RightConstants.COMPANY.COMPANY_INTENDEDCOMPANY_RETURN_BUSINESSPOOL} split={true}>
                            <Popconfirm placement="leftTop" title={'是否确认将该客户退回商机池？'} onConfirm={this.returnBool.bind(this, record)} okText="是" cancelText="否">
                                <a href="#">退回商机池</a>
                            </Popconfirm>
                        </RightBox>
                        <a href="#" onClick={this.handleOpen.bind(this, true, record, null, true)}>查看</a>
                    </span>
                );
            }
        }];

    render() {
        let dataSource = R.isNil(this.props.company.dataSource) ? {} : this.props.company.dataSource;
        let formItemLayout = { labelCol: { span: 8 }, wrapperCol: { span: 16 } };
        const { getFieldDecorator } = this.props.form;
        let values = this.props.form.getFieldsValue();
        let pagination = {
            showTotal: total => `共 ${total} 条数据`,
            current: this.props.company.page.page,
            pageSize: this.props.company.page.size,
            total: this.props.company.page.totalRow,
            showSizeChanger: true,
            onShowSizeChange: (current, size) => {
                let newPage = this.props.company.page;
                newPage.size = size;
                newPage.page = 1;
                this.props.dispatch({
                    type: 'company/queryCompanys',
                    payload: {
                        company: values.company,
                        dealt: '0',
                        claimStatus: '1',
                        page: newPage
                    }
                });
            },
            onChange: (pageNumber, pageSize) => {
                let newPage = this.props.company.page;
                newPage.page = pageNumber;
                this.props.dispatch({
                    type: 'company/queryCompanys',
                    payload: {
                        company: values.company,
                        dealt: '0',
                        claimStatus: '1',
                        page: newPage
                    }
                });
            }
        }
        return (
            <div>
                <Row>
                    <Col span={8}><FormItem {...formItemLayout} label={'客户查询'}>{getFieldDecorator('company')(<Input placeholder="可通过客户号或客户名称关键字搜索"/>)}</FormItem></Col>
                    <Col span={8} style={{ marginLeft: 24 }}>
                        <Button type="primary" icon="search" style={{ marginRight: 5 }} onClick={this.handleSearch.bind(this, false)}>查询</Button>
                        <RightBox resource={RightConstants.COMPANY.COMPANY_INTENDEDCOMPANY_ADD}>
                            <Button type="primary" icon="plus" style={{ marginRight: 5 }} onClick={this.handleOpen.bind(this, false, null, null, false)}>添加客户</Button>
                        </RightBox>
                    </Col>
                </Row>

                <Table loading={this.props.loading} rowKey={record => record.id} dataSource={this.props.company.list} columns={this.columns} bordered={true} size={'middle'} pagination={pagination} />
                <CompanyDetail wrappedComponentRef={(inst) => this.companyDetail = inst} dispatch={this.props.dispatch} dataSource={dataSource} refreshList={this.handleSearch} product />
            </div>
        )
    }
})

function mapStateToProps(state) {
    return {
        loading: state.loading.models.company, company: state.company
    };
}

export default connect(mapStateToProps)(intendedCompany);